<template>
  <section @click="clickCurrent('current')" @mousedown="clickCurrent('dragging')">
    <div :class="['custorm--modelbox', 'graphicueditor-show', (custormCurrent == custormIndex)?'drag active':'drag']">
      <div v-if="custormItemData.params.isshow == '2'" class="noshow" v-bind:style="{'background-image':`url(${getPath('noshow.png')})`}"></div>
      <div style="overflow: hidden;">
        <div class="es-richtext" v-bind:style="{'background':`${custormItemData.style.bgcolor}`,'margin':`${custormItemData.style.margincol}px ${custormItemData.style.marginrow}px`}">
          <p v-html="custormItemData.params.ueditor" style="min-height: 300px;">
          </p>
        </div>
      </div>
      <div class="btn-edit-del" @click="delCurrent"><span class="btn-del icon iconfont icon-close"></span></div>
    </div>
  </section>
</template>

<script>
import defaultConfig from './utils/showConfig'
export default {
  mixins: [defaultConfig.mixins],
  props: {
    defaultConfig: {
      type: Object,
      default: function() {
        return defaultConfig
      }
    }
  },
  methods: {

  }
}
</script>

<style lang="scss" scoped>
.custorm--modelbox.graphicueditor-show {
  /deep/ .es-richtext {
    word-wrap: break-word;
  }
  /deep/ .edui-editor-toolbarbox.edui-default,
  /deep/ .edui-editor-bottomContainer.edui-default {
    display: none !important;
  }
  /deep/ .edui-default.edui-editor {
    border: none !important;
    background: transparent !important;
  }
}
</style>
